<template>
  <div class="one">
    <el-row :gutter="20">
      <el-col :span="6">
        <div class="div_1"></div>
      </el-col>
      <el-col :span="6">
        <div class="div_1" @click="toSecond" >
          <img :src="img1" style=" width: 170px;
  height: 170px;">
        </div>
      </el-col>
      <el-col :span="6">
        <div class="div_1" @click="toThird">
          <img src="../Third/tupian.jpg" style=" width: 170px;
  height: 170px;">
        </div>
      </el-col>
      <el-col :span="6">
        <div class="div_1" @click="toForth">
          <img :src="imgForth" style=" width: 170px; margin-top: 20%" >
        </div>
      </el-col>
    </el-row>
  </div>

  <div class="two">
    <el-row :gutter="20">
      <el-col :span="6">
        <div class="div_1"></div>
      </el-col>

      <el-col :span="6">
        <!--第六组：校园安全管理系统入口-->
        <div class="div_1" @click="toSixth">
          <img :src="csl" style=" width: 100%; height: 100%">
        </div>
      </el-col>

      <el-col :span="6">
        <div class="div_1"></div>
      </el-col>
      <el-col :span="6">
        <div class="div_1"></div>
      </el-col>
    </el-row>
  </div>

</template>

<script setup>
import router from "@/router";
import { ref } from 'vue';
import img1 from "@/assets/学生管理系统/Logo.jpg";
import imgForth from "@/assets/资源管理系统/logo.png";
import csl from "@/assets/校园安全管理系统/csms_logo.png";
import {UserInfoStore} from "../../stores/csms";
import {generateUser} from "../../api/Sixth/csms";
import {ElMessage} from "element-plus";
import {UserLoginStore} from "@/stores/counter";

function toSecond(){
  router.replace({name:'HPage'})
}

function toThird(){
  router.replace({name:"AppLayout"})
}

function toForth(){
  router.replace({name:'ResourcePage'})
}
/**
 * 第六组：校园安全管理系统点击入口路由函数
 */
function toSixth(){
  const username = window.sessionStorage.getItem("username");
  if (username === null){
    ElMessage({message:"请先登录", type:'info', showClose:true});
    router.replace({name:'Login'});
  }
  else {
    ElMessage({message:"欢迎进入校园安全管理系统", type:'success', showClose:true});
    generateUser(username).then(res=>{
      console.log(res)
    })
    router.replace({name:'AlertView'})
  }
}

</script>

<style scoped>
.el-row {
  margin-bottom: 20px;
}
.el-row:last-child {
  margin-bottom: 0;
}
.el-col {
  border-radius: 4px;
}


/* div */
.div_1{
  width: 170px;
  height: 170px;
  border: 1px solid black;
}
.div_1:hover{
  border: 2px solid black;
}
.one{
  margin-top: 5%;
  margin-left: 10%;
}
.two{
  margin-left: 10%;
  margin-top: 5%;
}
</style>
